<!-- 相关日志数据弹窗 -->
<template>
  <el-dialog
    title="相关日志"
    :visible.sync="dialogVisible"
    :destroy-on-close="true"
    class="ky-small-dialog"
    width="68%"
    top="50px"
    :before-close="handleClose"
  >
    <div class="log_wrap">
      <el-card
        class="ky-card ky-card-hdbg"
        v-for="(item, index) in list"
        :key="index"
      >
        <h4>{{item[0].contentType}}</h4>
        <el-form
          inline
          class="ky-form-inline ky-form-inline-sm"
          size="mini"
          label-width="110px"
        >
          <el-form-item
            v-for="(obj, index) in item"
            :key="index"
            :label="obj.name"
          >
            <template slot="label">
              <div class="word" :title="obj.name">{{obj.name}}</div>
            </template>
            <el-input readonly :value="obj.value" style="width: 260px;"></el-input>
          </el-form-item>
        </el-form>
      </el-card>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button size="small" @click="handleClose">关 闭</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { getflogcontentlist } from '@/api/api.js'
export default {
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    rowData: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      dialogVisible: false,
      list: []
    }
  },
  watch: {
    visible: {
      handler(val) {
        this.dialogVisible = this.visible
        if (val) {
          this.getDetail()
        }
      }
    }
  },
  methods: {
    handleClose() {
      this.$emit('update:visible', false)
    },
    getDetail() {
      getflogcontentlist({
        hospitalCode: this.rowData.hospitalCode,
        fthings: this.rowData.fthings,
        flogId: this.rowData.flogId
      }).then((res) => {
        if (res && res.code === 10000) {
          this.list = res.content.list
        }
      })
    }
  }
}
</script>
<style lang='scss' scoped>
.ky-small-dialog{
  .ky-card{
    margin-bottom: 10px;
  }
  /deep/ .el-card__body{
    padding: 0px 10px 10px 10px;
  }
  /deep/ .el-dialog__body{
    padding: 0;
  }
}
.log_wrap{
  height: calc(100vh - 240px);
  overflow-y: auto;
  padding: 10px 20px;
}
.word {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
</style>
